JavaScript　初学者用チュートリアル　関数　関数リテラル　アロー関数

2021年5月20日 2021年5月20日

関数

関数とは

定義された式(パラメーター)に沿って処理がされ、その結果を返す一連の流れ

基本的な関数の構文(function命令)

function 関数名(引数、...) {
  処理の文
  return 戻り値;
}

関数の「宣言」です
宣言する事により、関数が定義されます
戻り値で処理が呼び出されます

関数名をつける際の注意点
『識別子のルール』
『その関数がどのような役割を持っているかすぐにわかるような名前』

識別子のルールについて

引数(パラメーター)

関数が呼び出されて初めて存在する変数
関数の挙動を実行するパラメーター
ルールとして「,」カンマで区切る

戻り値

関数の処理の結果を、最後に呼び出し、返される値

function square　(x , y) {
  return (x * y);
}
const x = 3, y = 5;
console.log(square(x,y));
//15

squareという関数に引数(x,y)を受け取り、戻り値にx*yを返す関数の流れです
const x,yに代入、宣言
関数の引数として宣言されたx、yは別のものとして認識されます
returnで処理の結果を返します

関数リテラル

名前のない関数を定義して、変数に入れる

let square = function(x , y) {
  return (x * y);
};
console.log(square(3 , 5));
//15

function命令は直接squareを定義しているのに対し
関数リテラルはfunction()で無名の関数を定義してsquare変数に入れていく流れです
関数リテラルは無名関数とも呼ばれています

functionではなく『=>』を記述
functionや{...}を省略して記述できる
引数が一つの場合()を省略できる

上の式をアロー関数で書いてみます

let square = (x ,y) => {
  return(x*y);
  };
console.log(square(3 , 5));
//15

引数がない場合の記述

let square = () => console.log ('hello world')